<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>


<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Mootools menu with accordeon and hover effects</title>

<meta http-equiv="Cache-Control" content="no-cache, must-revalidate">
<meta name="Identifier-url" content="http://www.artviper.de/mootoolsmenu">
<meta http-equiv="Content-Language" content="en">
<meta name="keywords" content="mootools menu, accordeon, hover, mootools">
<meta name="author" content="artViper desginstudio, Weiden, Germany">
<meta name="description" content="Mootools hover menu with accordeon sub menus.">
<meta name="audience" content="all">
<meta name="revisit-after" content="1 day">
<meta name="ICBM" content="49.67901452429961, 12.16435432434082">
<meta name="page-topic" content="Webdesign Weiden, Webdesign, Grafikdesign, Printmedien, Programmierung, AJAX, Scripts, PHP">

<meta name="language" content="en">
<meta name="copyright" content="artViper designstudio Webdesign, Grafikdesign Printmedien designstudio">
<meta name="publisher" content="artViper designstudio, Webdesign, Grafikdesign, Printmedien">
<meta name="generator" content="Macromedia Dreamweaver">
<script src="mootools.js" type="text/javascript" language="javascript"></script>

<style type="text/css">
<!--
#container {
	background: #333333;
	height: 600px;
	width: 980px;
	margin-right: auto;
	margin-left: -30px;
}
#btmenu {
	color: #FFFFFF;
	background: #000000;
	height: 200px;
	width: 400px;
	margin-right: auto;
	margin-left: auto;
	font-size: 11px;
	position: absolute;
	margin-top: 500px;
}
#container #menu {
	height: auto;
	width: 350px;
	float: left;
}
body {
	overflow: auto;
	background: #333;
	color: #FFFFFF;
	font: 12px Arial, Helvetica, sans-serif;
}
#container h1 {
	font-size: 16px;
}
#container #menu li {
	display: block;
	list-style-type: none;
}
#container #menu a {
	font-size: 11px;
	color: #FFFFFF;
	padding-right: 10px;
	padding-left: 10px;
	line-height: 30px;
	text-decoration: none;
	background: #000000 url(bg.jpg) no-repeat left;
	height: 30px;
	width: 180px;
	display: block;
	outline:0;
	margin-bottom: 5px;
}
#container #menu a:hover {
	color: #CCFF00;
}
#popup {
	float: right;
	width: 300px;
	border: thin solid #666666;
	height: auto;
	background: #FFFFFF;
	visibility:hidden;
	font: 11.333px Arial, Helvetica, sans-serif;
	padding: 10px;
	margin-right: 20px;
}
#container #menu .accordion a {
	color: #FFCC00;
}
#container #menu .accordion a:hover {
	color: #FFFF00;
}

-->
</style></head><body>

<font color=white size=3>DOCUMENT CLUSTERS:</font><br>
<div id="container">
<div id="menu">
<ul>
